<include file="__THEME__/header" />
<link href="../Public/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/highcharts/highcharts.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/highcharts/modules/exporting.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/raty/jquery.raty.min.js"></script>

<script type="text/javascript">
	$(function() {
		$('#health').highcharts({
			chart : {
				type : 'line'
			},
			title : {
				align: 'left',
				text : '1. 健康状态图表'
			},
			subtitle : {
				text : '来源: sns.com'
			},
			xAxis : {
				categories : ['Jan', 'Feb', 'Mar',]
			},
			yAxis : {
                title: {
                    text: ''
                },				
	            labels: {
	                // format: '{value} km'
	                formatter: function() {
	                	var data;
						switch(this.value){
							case 1: data = '非常差';break;
							case 2: data = '差';break;
							case 3: data = '一般';break;
							case 4: data = '好';break;
							case 5: data = '非常好';break;
						}
						return data;
	                },
					style: {
						fontSize: '14px'
					}	                	                
	            }				
			},
			tooltip : {
				// crosshairs: true,
				formatter : function() {
                	var data;
					switch(this.y){
						case 1: data = '非常差';break;
						case 2: data = '差';break;
						case 3: data = '一般';break;
						case 4: data = '好';break;
						case 5: data = '非常好';break;
					}					
					return '<b>' + this.x + '</b><br/>状态：' + data + '<br/>备注：' + this.point.content;
				}
			},
			plotOptions : {
				line : {
					dataLabels : {
						enabled : false
					},
					// enableMouseTracking : false
				}
			},
	        legend: {
				enabled: false
	        },  			
	        credits: {
	            enabled: false
	        },  			
			series : [{
				name : '健康状态',
				data : [
	                // {
	                    // y: 3,
	                    // content:'test'
	                // },
	                // {
	                    // y: 1,
	                    // content:'test'
	                // },
	                // {
	                    // y: 4,
	                    // content:'test'
	                // },
				]
			}]
		});
		
        $.post(APP+"/Index/getHealthData",null,function(json){
        	var json = eval("("+json+")");
            if(json.status == 1){
        		var chart = $('#health').highcharts();
            	chart.xAxis[0].setCategories(json.data['date']);
        		chart.series[0].setData(json.data['result']);
            }else{
            	alert('数据连接失败，请稍后再试！')
            }
        });				
	});
	
	
</script>
<script type="text/javascript">
	$(function() {
		$('#blood-pressure').highcharts({
			chart : {
				type : 'spline'
			},
			title : {
				align: 'left',
				text : '3. 一周血压趋势'
			},
			subtitle : {
				text : '来源: sns.com'
			},
			xAxis : {
				categories : ['MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT', 'SUN']
			},
			yAxis : {
				title : {
					text : ''
				},
				labels : {
					formatter : function() {
						return this.value + 'kpa';
					}
				}
			},
			tooltip : {
				crosshairs : true,
				shared : true
			},
			plotOptions : {
				spline : {
					marker : {
						radius : 4,
						lineColor : '#666666',
						lineWidth : 1
					}
				}
			},
	        credits: {
	            enabled: false
	        },  			
			series : [{
				name : '舒张压',
				marker : {
					symbol : 'square'
				},
				data : [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2]

			}, {
				name : '收缩压',
				marker : {
					symbol : 'diamond'
				},
				data : [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0]
			}]
		});
	});

</script>
<script>
	function winMini(){
		ymPrompt.win(APP+'/Index/addMini',530,255,'添加状态',null,null,null,{id:'a'});
	}
	
	function getHealthData(range){
        $.post(APP+"/Index/getHealthData",{range:range},function(json){
        	var json = eval("("+json+")");
            if(json.status == 1){
        		var chart = $('#health').highcharts();
            	chart.xAxis[0].setCategories(json.data['date']);
        		chart.series[0].setData(json.data['result']);
            }else{
            	alert('数据连接失败，请稍后再试！')
            }
        });			
	}
	
	function getBMI(){
		var height = $("#height").val();
		var weight = $("#weight").val();
		if(!height){alert('身高不能为空！');return false;}
		if(!weight){alert('体重不能为空！');return false;}
        $.post(APP+"/Index/getBMI",{height:height,weight:weight},function(json){
        	var json = eval("("+json+")");
            if(json.status == 1){
            	$("#height").attr('value','');
            	$("#weight").attr('value','');
				$("#BMI").text(json.data['BMI']);
				$("#normal").text(json.data['normal']);
            }else{
            	alert('数据连接失败，请稍后再试！')
            }
        });			
	}	
</script>

<!-- 内容 begin  -->
<div class="content">
	<include file="__THEME__/banner" />
	<include file="__THEME__/apps_wide" />
	<div class="main" >
		<script type="text/javascript" src="../Public/Js/Common.js" ></script>
		<link href="__PUBLIC__/js/pagination/pagination.css" rel="stylesheet" type="text/css" />
		
		<div class="intro">
			<h2>健康数据统计</h2>
		</div>
		<div class="layout">
			<div class="common-box">
				<div id="health" style="min-width: 700px; height: 300px; margin: 0 auto; float: left;"></div>
				<div class="action">
					<a href="#" onclick="winMini();return false;">+添加状态</a>
					<a href="#" onclick="getHealthData('week');return false;">本周状态</a>
					<a href="#" onclick="getHealthData('month');return false;">本月状态</a>
					<a href="#" onclick="getHealthData('');return false;">最近十天</a>
				</div>
			</div>
			<div class="c"></div>
			<div class="common-box">
				<div class="common-box-hd">2. 身高体重比</div>
				<div class="common-box-bd">
					<div class="form-bg">
						<form method="post" name="bmiform">
							<div class="field">
								当前身高：<input type="text" class="txt" id="height"/>厘米（cm）
							</div>
							<div class="field">
								当前体重：<input type="text" class="txt" id="weight"/>公斤（kg）
							</div>
							<div class="field">
								<input type="button" class="sub-btn" onclick="getBMI();return false;" value="提交" />
								<input type="button" class="sub-btn" onclick="document.bmiform.reset();" value="清空" />
							</div>
						</form>
					</div>
					<div class="result">
						您的BMI指数：<br>
						<span><em id="BMI">20.2</em></span>
						您的理想体重：<br>
						<span><em id="normal">68</em>&nbsp;公斤(kg)</span>
					</div>
					<div class="tips">
						<b>BMI指数说明:</b><br>
						19以下 体重偏低<br>
						19-25 健康体重<br>
						25-30 超重<br>
						30-39 严重超重<br>
						40及40以上 极度超重	<br>					
					</div>
				</div>
			</div>
			<div class="c"></div>
			<div class="common-box">
				<div class="common-box-bd">
					<div id="blood-pressure" style="min-width: 500px; height: 300px; margin: 0 auto; float: left;"></div>
					<div class="panel">
						<form method="post" name="bmiform">
							<div class="field">
								舒张压：<input type="text" class="txt" id="height"/>
							</div>
							<div class="field">
								收缩压：<input type="text" class="txt" id="weight"/>
							</div>
							<div class="field">
								<input type="button" class="sub-btn" onclick="return false;" value="提交"  style="margin-top:15px;" />
							</div>
						</form>						
					</div>
				</div>
			</div>
			<div class="c"></div>
		</div>
		
		<input id="page" type="hidden" value="{$_GET['p']}">
	</div>
	<div class="c"></div>
</div>
<!-- 内容 end -->

<script type="text/javascript">
	$(function(){
		$("#category").change(function(){
			
			var categoryid = $(this).val();
	        $.post(APP+"/Index/getMedicineByCategoryId",{categoryid:categoryid},function(json){
	        	var json = eval("("+json+")");
	        	// alert(json.data);return false;
	            if(json.status == 1){
	            	$("#medicinebox").empty();
	            	$.each(json.data,function(key,value){
	            		$("#medicinebox").append(
	            			'<label><input type="checkbox" name="medicines[]" value='+key+' />'+value+'</label>'
	            		);
	            	});
	            }else{
					$("#medicinebox").html('<center>对不起，暂时还没有相关数据！<center>');
	            }
	        });		
			$('#'+type).show();
			$('#'+type).find("input").removeAttr("disabled");
		});
		
		$("#category").find("option[value={$gcid}]").attr("selected",true);
		$('#category').triggerHandler('change');
	});
	
	function winMedicine() {
		var categoryid = $("#category").children("option:selected").val();
		ymPrompt.win(APP+'/Index/addMedicine/categoryid/'+categoryid,350,200,'添加药物',null,null,null,{id:'a'});
	}
	
</script>


<include file="__THEME__/footer" />

